<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="ThemeBucket">
    <link rel="shortcut icon" href="#" type="image/png">

    <title>Basic Table</title>

    <link href="css/style.css" rel="stylesheet">
    <link href="css/style-responsive.css" rel="stylesheet">

    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
    <script src="js/html5shiv.js"></script>
    <script src="js/respond.min.js"></script>
    <![endif]-->
</head>

<body class="sticky-header">
    <section>
        <!-- left side start-->
        <div class="left-side sticky-left-side">

            <!--logo and iconic logo start-->
            <div class="logo">
                <a href="index.html">
                    <img src="images/logo.png" alt=""></a>
            </div>

            <div class="logo-icon text-center">
                <a href="index.html">
                    <img src="images/logo_icon.png" alt=""></a>
            </div>
            <!--logo and iconic logo end-->

            <div class="left-side-inner">

                <!-- 头部用户个人操作 -->
                <div class="visible-xs hidden-sm hidden-md hidden-lg">
                    <div class="media logged-user">
                        <img alt="" src="images/photos/user-avatar.png" class="media-object">
                        <div class="media-body">
                            <h4>
                                <a href="#">管理员</a>
                            </h4>
                            <span>"你好啊..."</span>
                        </div>
                    </div>

                    <h5 class="left-nav-title">账户信息</h5>
                    <ul class="nav nav-pills nav-stacked custom-nav">
                        <li>
                            <a href="#"> <i class="fa fa-user"></i>
                                <span>用户资料</span>
                            </a>
                        </li>
                        <li>
                            <a href="#"> <i class="fa fa-cog"></i>
                                <span>设置</span>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <i class="fa fa-sign-out"></i>
                                <span>退出</span>
                            </a>
                        </li>
                    </ul>
                </div>

                <!--侧边栏导航开始-->
                <ul class="nav nav-pills nav-stacked custom-nav">
                    <li class="menu-list">
                        <a href="index.html">
                            <i class="fa fa-home"></i>
                            <span>指示板</span>
                        </a>
                        <ul class="sub-menu-list">
                            <li class="">
                                <a href="index_alt.html">指示板 1</a>
                            </li>
                            <li>
                                <a href="index.html">指示板 2</a>
                            </li>
                        </ul>
                    </li>
                    <li class="menu-list">
                        <a href="">
                            <i class="fa fa-laptop"></i>
                            <span>布局</span>
                        </a>
                        <ul class="sub-menu-list">
                            <li>
                                <a href="blank_page.html">空白页</a>
                            </li>
                            <li>
                                <a href="boxed_view.html">盒装页面  居中显示</a>
                            </li>
                            <li>
                                <a href="leftmenu_collapsed_view.html">缩小侧边栏</a>
                            </li>
                            <li>
                                <a href="horizontal_menu.html">水平菜单</a>
                            </li>

                        </ul>
                    </li>
                    <li class="menu-list">
                        <a href="">
                            <i class="fa fa-book"></i>
                            <span>UI 元素</span>
                        </a>
                        <ul class="sub-menu-list">
                            <li>
                                <a href="general.html">普通样式</a>
                            </li>
                            <li>
                                <a href="buttons.html">按钮样式</a>
                            </li>
                            <li>
                                <a href="tabs-accordions.html">选项卡</a>
                            </li>
                            <li>
                                <a href="typography.html">字体排版</a>
                            </li>
                            <li>
                                <a href="slider.html">滑块</a>
                            </li>
                            <li>
                                <a href="panels.html">折叠面板</a>
                            </li>
                            <li>
                                <a href="widgets.html">小部件</a>
                            </li>
                        </ul>
                    </li>
                    <li class="menu-list">
                        <a href="">
                            <i class="fa fa-cogs"></i>
                            <span>组件</span>
                        </a>
                        <ul class="sub-menu-list">
                            <li>
                                <a href="grids.html">网格</a>
                            </li>
                            <li>
                                <a href="gallery.html">图片画廊</a>
                            </li>
                            <li>
                                <a href="calendar.html">日历</a>
                            </li>
                            <li>
                                <a href="tree_view.html">树状图</a>
                            </li>
                            <li>
                                <a href="nestable.html">可拖动组件</a>
                            </li>

                        </ul>
                    </li>

                    <li>
                        <a href="fontawesome.html">
                            <i class="fa fa-bullhorn"></i>
                            <span>图标</span>
                        </a>
                    </li>

                    <li class="menu-list">
                        <a href="">
                            <i class="fa fa-envelope"></i>
                            <span>邮件</span>
                        </a>
                        <ul class="sub-menu-list">
                            <li>
                                <a href="mail.html">收件箱</a>
                            </li>
                            <li>
                                <a href="mail_compose.html">写邮件</a>
                            </li>
                            <li>
                                <a href="mail_view.html">查看邮件</a>
                            </li>
                        </ul>
                    </li>

                    <li class="menu-list">
                        <a href="">
                            <i class="fa fa-tasks"></i>
                            <span>表单</span>
                        </a>
                        <ul class="sub-menu-list">
                            <li>
                                <a href="form_layouts.html">表单布局</a>
                            </li>
                            <li>
                                <a href="form_advanced_components.html">先进的组件</a>
                            </li>
                            <li>
                                <a href="form_wizard.html">表单向导</a>
                            </li>
                            <li>
                                <a href="form_validation.html">表单验证</a>
                            </li>
                            <li>
                                <a href="editors.html">富文本</a>
                            </li>
                            <li>
                                <a href="inline_editors.html">内联编辑</a>
                            </li>
                            <li>
                                <a href="pickers.html">选择器组件</a>
                            </li>
                            <li>
                                <a href="dropzone.html">文件上传</a>
                            </li>
                        </ul>
                    </li>
                    <li class="menu-list">
                        <a href="">
                            <i class="fa fa-bar-chart-o"></i>
                            <span>图表</span>
                        </a>
                        <ul class="sub-menu-list">
                            <li>
                                <a href="flot_chart.html">Flot 图表</a>
                            </li>
                            <li>
                                <a href="morris.html">莫里斯图表</a>
                            </li>
                            <li>
                                <a href="chartjs.html">Chartjs</a>
                            </li>
                            <li>
                                <a href="c3chart.html">C3 图表</a>
                            </li>
                        </ul>
                    </li>
                    <li class="menu-list  nav-active">
                        <a href="#">
                            <i class="fa fa-th-list"></i>
                            <span>数据表</span>
                        </a>
                        <ul class="sub-menu-list">
                            <li class="active">
                                <a href="basic_table.html">基本表</a>
                            </li>
                            <li>
                                <a href="dynamic_table.html">先进的表</a>
                            </li>
                            <li>
                                <a href="responsive_table.html">响应表</a>
                            </li>
                            <li>
                                <a href="editable_table.html">可编辑表</a>
                            </li>
                        </ul>
                    </li>

                    <li class="menu-list">
                        <a href="#">
                            <i class="fa fa-map-marker"></i>
                            <span>地图</span>
                        </a>
                        <ul class="sub-menu-list">
                            <li>
                                <a href="google_map.html">谷歌地图</a>
                            </li>
                            <li>
                                <a href="vector_map.html">矢量地图</a>
                            </li>
                        </ul>
                    </li>
                    <li class="menu-list">
                        <a href="">
                            <i class="fa fa-file-text"></i>
                            <span>其他页面</span>
                        </a>
                        <ul class="sub-menu-list">
                            <li>
                                <a href="profile.html">配置文件</a>
                            </li>
                            <li>
                                <a href="invoice.html">发票</a>
                            </li>
                            <li>
                                <a href="pricing_table.html">定价表</a>
                            </li>
                            <li>
                                <a href="timeline.html">时间轴</a>
                            </li>
                            <li>
                                <a href="blog_list.html">博客列表</a>
                            </li>
                            <li>
                                <a href="blog_details.html">博客详情</a>
                            </li>
                            <li>
                                <a href="directory.html">目录</a>
                            </li>
                            <li>
                                <a href="chat.html">聊天</a>
                            </li>
                            <li>
                                <a href="404.html">404 错误</a>
                            </li>
                            <li>
                                <a href="500.html">500 错误</a>
                            </li>
                            <li>
                                <a href="registration.html">注册页面</a>
                            </li>
                            <li>
                                <a href="lock_screen.html">屏幕锁</a>
                            </li>
                        </ul>
                    </li>
                    <li>
                        <a href="login.html">
                            <i class="fa fa-sign-in"></i>
                            <span>登陆页面</span>
                        </a>
                    </li>

                </ul>
                <!--侧边栏导航结束--> </div>
        </div>
        <!-- 左侧结束-->

        <!-- main content start-->
        <div class="main-content">

            <!-- 头部分开始-->
            <div class="header-section">

                <!--开关按钮开始-->
                <a class="toggle-btn">
                    <i class="fa fa-bars"></i>
                </a>
                <!--开关按钮结束-->

                <!--搜索开始-->
                <form class="searchform" action="http://view.jqueryfuns.com/2014/4/10/7_df25ceea231ba5f44f0fc060c943cdae/index.html" method="post">
                    <input type="text" class="form-control" name="keyword" placeholder="Search here..." />
                </form>
                <!--搜索结束-->

                <!--通知菜单开始 -->
                <div class="menu-right">
                    <ul class="notification-menu">
                        <li>
                            <a href="#" class="btn btn-default dropdown-toggle info-number" data-toggle="dropdown">
                                <i class="fa fa-tasks"></i>
                                <span class="badge">8</span>
                            </a>
                            <div class="dropdown-menu dropdown-menu-head pull-right">
                                <h5 class="title">你有八个未解决的问题</h5>
                                <ul class="dropdown-list user-list">
                                    <li class="new">
                                        <a href="#">
                                            <div class="task-info">
                                                <div>数据库更新</div>
                                            </div>
                                            <div class="progress progress-striped">
                                                <div style="width: 40%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="40" role="progressbar" class="progress-bar progress-bar-warning">
                                                    <span class="">40%</span>
                                                </div>
                                            </div>
                                        </a>
                                    </li>
                                    <li class="new">
                                        <a href="#">
                                            <div class="task-info">
                                                <div>test2</div>
                                            </div>
                                            <div class="progress progress-striped">
                                                <div style="width: 90%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="90" role="progressbar" class="progress-bar progress-bar-success">
                                                    <span class="">90%</span>
                                                </div>
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#">
                                            <div class="task-info">
                                                <div>test2</div>
                                            </div>
                                            <div class="progress progress-striped">
                                                <div style="width: 66%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="66" role="progressbar" class="progress-bar progress-bar-info">
                                                    <span class="">66%</span>
                                                </div>
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#">
                                            <div class="task-info">
                                                <div>test2</div>
                                            </div>
                                            <div class="progress progress-striped">
                                                <div style="width: 33%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="33" role="progressbar" class="progress-bar progress-bar-danger">
                                                    <span class="">33%</span>
                                                </div>
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#">
                                            <div class="task-info">
                                                <div>test2</div>
                                            </div>
                                            <div class="progress progress-striped">
                                                <div style="width: 80%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="80" role="progressbar" class="progress-bar">
                                                    <span class="">80%</span>
                                                </div>
                                            </div>
                                        </a>
                                    </li>
                                    <li class="new">
                                        <a href="">看到所有未解决任务</a>
                                    </li>
                                </ul>
                            </div>
                        </li>
                        <li>
                            <a href="#" class="btn btn-default dropdown-toggle info-number" data-toggle="dropdown">
                                <i class="fa fa-envelope-o"></i>
                                <span class="badge">5</span>
                            </a>
                            <div class="dropdown-menu dropdown-menu-head pull-right">
                                <h5 class="title">你有5封邮件</h5>
                                <ul class="dropdown-list normal-list">
                                    <li class="new">
                                        <a href="">
                                            <span class="thumb">
                                                <img src="images/photos/user1.png" alt="" />
                                            </span>
                                            <span class="desc">
                                                <span class="name">
                                                    管理员
                                                    <span class="badge badge-success">new</span>
                                                </span>
                                                <span class="msg">测试数据...</span>
                                            </span>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="">
                                            <span class="thumb">
                                                <img src="images/photos/user2.png" alt="" />
                                            </span>
                                            <span class="desc">
                                                <span class="name">管理员</span>
                                                <span class="msg">测试数据...</span>
                                            </span>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="">
                                            <span class="thumb">
                                                <img src="images/photos/user3.png" alt="" />
                                            </span>
                                            <span class="desc">
                                                <span class="name">管理员</span>
                                                <span class="msg">测试数据...</span>
                                            </span>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="">
                                            <span class="thumb">
                                                <img src="images/photos/user4.png" alt="" />
                                            </span>
                                            <span class="desc">
                                                <span class="name">管理员</span>
                                                <span class="msg">测试数据...</span>
                                            </span>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="">
                                            <span class="thumb">
                                                <img src="images/photos/user5.png" alt="" />
                                            </span>
                                            <span class="desc">
                                                <span class="name">管理员</span>
                                                <span class="msg">测试数据...</span>
                                            </span>
                                        </a>
                                    </li>
                                    <li class="new">
                                        <a href="">阅读所有的邮件</a>
                                    </li>
                                </ul>
                            </div>
                        </li>
                        <li>
                            <a href="#" class="btn btn-default dropdown-toggle info-number" data-toggle="dropdown">
                                <i class="fa fa-bell-o"></i>
                                <span class="badge">4</span>
                            </a>
                            <div class="dropdown-menu dropdown-menu-head pull-right">
                                <h5 class="title">通知</h5>
                                <ul class="dropdown-list normal-list">
                                    <li class="new">
                                        <a href="">
                                            <span class="label label-danger">
                                                <i class="fa fa-bolt"></i>
                                            </span>
                                            <span class="name">服务器# 1超载.</span> <em class="small">34 mins</em>
                                        </a>
                                    </li>
                                    <li class="new">
                                        <a href="">
                                            <span class="label label-danger">
                                                <i class="fa fa-bolt"></i>
                                            </span>
                                            <span class="name">服务器# 1超载.</span> <em class="small">1 hrs</em>
                                        </a>
                                    </li>
                                    <li class="new">
                                        <a href="">
                                            <span class="label label-danger">
                                                <i class="fa fa-bolt"></i>
                                            </span>
                                            <span class="name">服务器# 1超载.</span>
                                            <em class="small">4 hrs</em>
                                        </a>
                                    </li>
                                    <li class="new">
                                        <a href="">
                                            <span class="label label-danger">
                                                <i class="fa fa-bolt"></i>
                                            </span>
                                            <span class="name">服务器# 1超载.</span>
                                            <em class="small">4 hrs</em>
                                        </a>
                                    </li>
                                    <li class="new">
                                        <a href="">看到所有的通知</a>
                                    </li>
                                </ul>
                            </div>
                        </li>
                        <li>
                            <a href="#" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                                <img src="images/photos/user-avatar.png" alt="" />
                                管理员
                                <span class="caret"></span>
                            </a>
                            <ul class="dropdown-menu dropdown-menu-usermenu pull-right">
                                <li>
                                    <a href="#">
                                        <i class="fa fa-user"></i>
                                        用户信息
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <i class="fa fa-cog"></i>
                                        设置
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <i class="fa fa-sign-out"></i>
                                        登出
                                    </a>
                                </li>
                            </ul>
                        </li>

                    </ul>
                </div>
                <!--通知菜单结束 --> </div>
            <!-- 头部分结束-->

            <!-- 页面标题开始-->
            <div class="page-heading">
                <h3>Basic Table</h3>
                <ul class="breadcrumb">
                    <li>
                        <a href="#">Dashboard</a>
                    </li>
                    <li>
                        <a href="#">Data Table</a>
                    </li>
                    <li class="active">Basic Table</li>
                </ul>
            </div>
            <!-- 页面标题结束-->

            <!--内容区域开始-->
            <div class="wrapper">
                <div class="row">
                    <div class="col-sm-6">
                        <section class="panel">
                            <header class="panel-heading">
                                Basic Table
                                <span class="tools pull-right">
                                    <a href="javascript:;" class="fa fa-chevron-down"></a>
                                    <a href="javascript:;" class="fa fa-times"></a>
                                </span>
                            </header>
                            <div class="panel-body">
                                <table class="table">
                                    <thead>
                                        <tr>
                                            <th>#</th>
                                            <th>First Name</th>
                                            <th>Last Name</th>
                                            <th>Username</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr>
                                            <td>1</td>
                                            <td>Mark</td>
                                            <td>Otto</td>
                                            <td>@mdo</td>
                                        </tr>
                                        <tr>
                                            <td>2</td>
                                            <td>Jacob</td>
                                            <td>Thornton</td>
                                            <td>@fat</td>
                                        </tr>
                                        <tr>
                                            <td>3</td>
                                            <td>Larry</td>
                                            <td>the Bird</td>
                                            <td>@twitter</td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>

                        </section>
                    </div>
                    <div class="col-sm-6">
                        <section class="panel">
                            <header class="panel-heading">
                                Striped Table
                                <span class="tools pull-right">
                                    <a href="javascript:;" class="fa fa-chevron-down"></a>
                                    <a href="javascript:;" class="fa fa-times"></a>
                                </span>
                            </header>
                            <div class="panel-body">
                                <table class="table table-striped">
                                    <thead>
                                        <tr>
                                            <th>#</th>
                                            <th>First Name</th>
                                            <th>Last Name</th>
                                            <th>Username</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr>
                                            <td>1</td>
                                            <td>Mark</td>
                                            <td>Otto</td>
                                            <td>@mdo</td>
                                        </tr>
                                        <tr>
                                            <td>2</td>
                                            <td>Jacob</td>
                                            <td>Thornton</td>
                                            <td>@fat</td>
                                        </tr>
                                        <tr>
                                            <td>3</td>
                                            <td>Larry</td>
                                            <td>the Bird</td>
                                            <td>@twitter</td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </section>
                    </div>
                </div>
                <div class="row">
                    <div class="col-sm-6">
                        <section class="panel">
                            <header class="panel-heading no-border">
                                Border Table
                                <span class="tools pull-right">
                                    <a href="javascript:;" class="fa fa-chevron-down"></a>
                                    <a href="javascript:;" class="fa fa-times"></a>
                                </span>
                            </header>
                            <div class="panel-body">
                                <table class="table table-bordered">
                                    <thead>
                                        <tr>
                                            <th>#</th>
                                            <th>First Name</th>
                                            <th>Last Name</th>
                                            <th>Username</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr>
                                            <td rowspan="2">1</td>
                                            <td>Mark</td>
                                            <td>Otto</td>
                                            <td>@mdo</td>
                                        </tr>
                                        <tr>
                                            <td>Mark</td>
                                            <td>Otto</td>
                                            <td>@TwBootstrap</td>
                                        </tr>
                                        <tr>
                                            <td>2</td>
                                            <td>Jacob</td>
                                            <td>Thornton</td>
                                            <td>@fat</td>
                                        </tr>
                                        <tr>
                                            <td>3</td>
                                            <td colspan="2">Larry the Bird</td>
                                            <td>@twitter</td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </section>
                    </div>
                    <div class="col-sm-6">
                        <section class="panel">
                            <header class="panel-heading">
                                Hover Table
                                <span class="tools pull-right">
                                    <a href="javascript:;" class="fa fa-chevron-down"></a>
                                    <a href="javascript:;" class="fa fa-times"></a>
                                </span>
                            </header>
                            <div class="panel-body">
                                <table class="table table-hover">
                                    <thead>
                                        <tr>
                                            <th>#</th>
                                            <th>First Name</th>
                                            <th>Last Name</th>
                                            <th>Username</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr>
                                            <td>1</td>
                                            <td>Mark</td>
                                            <td>Otto</td>
                                            <td>@mdo</td>
                                        </tr>
                                        <tr>
                                            <td>2</td>
                                            <td>Jacob</td>
                                            <td>Thornton</td>
                                            <td>@fat</td>
                                        </tr>
                                        <tr>
                                            <td>3</td>
                                            <td colspan="2">Larry the Bird</td>
                                            <td>@twitter</td>
                                        </tr>
                                        <tr>
                                            <td>3</td>
                                            <td>Jane Doe</td>
                                            <td>Mosa</td>
                                            <td>@twitter</td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </section>
                    </div>
                </div>
                <div class="row">
                    <div class="col-sm-12">
                        <section class="panel">
                            <header class="panel-heading">
                                General Table
                                <span class="tools pull-right">
                                    <a href="javascript:;" class="fa fa-chevron-down"></a>
                                    <a href="javascript:;" class="fa fa-times"></a>
                                </span>
                            </header>
                            <div class="panel-body">
                                <table class="table  table-hover general-table">
                                    <thead>
                                        <tr>
                                            <th>Company</th>
                                            <th class="hidden-phone">Descrition</th>
                                            <th>Profit</th>
                                            <th>Status</th>
                                            <th>Progress</th>
                                        </tr>
                                    </thead>
                                    <tbody>

                                        <tr>
                                            <td>
                                                <a href="#">ThemeBucket</a>
                                            </td>
                                            <td class="hidden-phone">Lorem Ipsum dorolo</td>
                                            <td>556.00$</td>
                                            <td>
                                                <span class="label label-warning label-mini">Due</span>
                                            </td>
                                            <td>
                                                <div class="progress progress-striped progress-xs">
                                                    <div style="width: 70%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="40" role="progressbar" class="progress-bar progress-bar-danger">
                                                        <span class="sr-only">70% Complete (success)</span>
                                                    </div>
                                                </div>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>
                                                <a href="#">XYZ</a>
                                            </td>
                                            <td class="hidden-phone">Lorem Ipsum dorolo</td>
                                            <td>13240.00$</td>
                                            <td>
                                                <span class="label label-success label-mini">Paid</span>
                                            </td>
                                            <td>
                                                <div class="progress progress-striped progress-xs">
                                                    <div style="width: 55%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="40" role="progressbar" class="progress-bar progress-bar-warning">
                                                        <span class="sr-only">55% Complete (success)</span>
                                                    </div>
                                                </div>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>
                                                <a href="#">Graphics</a>
                                            </td>
                                            <td class="hidden-phone">Lorem Ipsum dorolo imit</td>
                                            <td>1320.00$</td>
                                            <td>
                                                <span class="label label-info label-mini">Due</span>
                                            </td>
                                            <td>
                                                <div class="progress progress-striped progress-xs">
                                                    <div style="width: 40%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="40" role="progressbar" class="progress-bar progress-bar-success">
                                                        <span class="sr-only">40% Complete (success)</span>
                                                    </div>
                                                </div>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>
                                                <a href="#">BCSE</a>
                                            </td>
                                            <td class="hidden-phone">Lorem Ipsum dorolo</td>
                                            <td>3455.50$</td>
                                            <td>
                                                <span class="label label-danger label-mini">Paid</span>
                                            </td>
                                            <td>
                                                <div class="progress progress-striped progress-xs">
                                                    <div style="width: 90%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="40" role="progressbar" class="progress-bar progress-bar-info">
                                                        <span class="sr-only">90% Complete (success)</span>
                                                    </div>
                                                </div>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>
                                                <a href="#">AVC Ltd</a>
                                            </td>
                                            <td class="hidden-phone">Lorem Ipsum dorolo imit</td>
                                            <td>110.00$</td>
                                            <td>
                                                <span class="label label-primary label-mini">Due</span>
                                            </td>
                                            <td>
                                                <div class="progress progress-striped progress-xs">
                                                    <div style="width: 60%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="40" role="progressbar" class="progress-bar progress-bar-success">
                                                        <span class="sr-only">60% Complete (success)</span>
                                                    </div>
                                                </div>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>
                                                <a href="#">Themeforest</a>
                                            </td>
                                            <td class="hidden-phone">Lorem Ipsum dorolo</td>
                                            <td>456.00$</td>
                                            <td>
                                                <span class="label label-warning label-mini">Due</span>
                                            </td>
                                            <td>
                                                <div class="progress progress-striped progress-xs">
                                                    <div style="width: 40%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="40" role="progressbar" class="progress-bar progress-bar-danger">
                                                        <span class="sr-only">40% Complete (success)</span>
                                                    </div>
                                                </div>
                                            </td>
                                        </tr>

                                    </tbody>
                                </table>
                            </div>
                        </section>
                    </div>
                </div>
            </div>
            <!--内容区域结束-->

            <!--footer  start-->
            <footer>2014 &copy; AdminEx by ThemeBucket</footer>
            <!--footer  end--> </div>
        <!-- main content end--> </section>

    <!-- Placed js at the end of the document so the pages load faster -->
    <script src="js/jquery-1.10.2.min.js"></script>
    <script src="js/jquery-ui-1.9.2.custom.min.js"></script>
    <script src="js/jquery-migrate-1.2.1.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/modernizr.min.js"></script>
    <script src="js/jquery.nicescroll.js"></script>

    <!--common scripts for all pages-->
    <script src="js/scripts.js"></script>

</body>

</html>